<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <link rel="shortcut icon" href="./img/logo.png" type="image/x-icon">
    <script src="js/zepto.js"></script>
    <script src="./js/axios.js"></script>
    <link rel="stylesheet" href="css/login_wzt.css">
    <title>欢迎登陆</title>
</head>

<body>
    <div class="content">
        <div class="App ke">
            <div class="head">
                <a href="user_wzt.html"><img src="img/x.svg" class="close-btn" alt=""></a>
                <a href="registered_wzt.html"><button class="register">注册</button></a>
            </div>
            <!-- 登陆 -->
            <div>
                <div class="view-title">账号密码登录</div>
                <!-- <form action="http://localhost:3000/login"> -->
                <div class="input-col">
                    <input type="tel" name="phone" id="phone" class="input-field" placeholder="请输入手机号">
                </div>
                <div class="input-col">
                    <input type="password" name="password" class="input-field" id="paw" placeholder="请输入密码">
                </div>
                <input type="submit" class="submit-btn" id="login" value="登录"></input>
                <!-- </form> -->
                <div class="view-footer">
                    <div class="footer-actions">
                        <button>手机快捷登录</button>
                        <button>忘记密码</button>
                    </div>
                    <span class="footer-comment">
                        注册/登录即代表同意
                        <a href="https://m.ke.com/user/protocol" class="link">《快捷隐私政策》</a>
                        及
                        <a href="https://m.ke.com/user/serviceProtocol" class="link">《快捷用户使用协议》</a>
                    </span>
                </div>
            </div>
        </div>
    </div>
    <script>
        //自适应字体大小
        (function () {
            function w() {
                var all = document.documentElement;
                var test = all.getBoundingClientRect().width;
                rem = test / 26;
                all.style.fontSize = rem + 'px'
            }
            w();
            window.addEventListener("resize", function () {
                w()
            }, false)
        })();
        // 判断密码是否正确
        $("#login").click(() => {
            getAjax()
        })
        async function getAjax() {
            let res = await axios.get("http://127.0.0.1:3033/login", {});
            // console.log(res);
            let arr = res.data;
            console.log(arr);
            console.log($('#phone').val());
            console.log($('#paw').val());
            if($('#phone').val()===arr[0].username){
                if($('#paw').val()===arr[0].password){
                    sessionStorage.setItem('login',JSON.stringify(res.data))
                    location='index_wzt.html'
                }else{
                    alert('密码不正确')
                }
            }else{
                alert('手机号不正确')
            }

        }
    </script>
</body>

</html>